<template>
  <div class="provincial-details flex flex-column">
    <info-title>基础信息</info-title>
    <descriptions :columns="descriptionsList.slice(6, 10)" :data-source="alarmDetails" :col-span="24" />
    <template v-if="alarmDetails.handle_status == 1">
      <info-title>处理信息</info-title>
      <descriptions :columns="descriptionsList.slice(-4, -1)" :data-source="alarmDetails" :col-span="24" />
    </template>
    <template v-if="alarmDetails.send_sms_status == 1">
      <info-title>推送信息</info-title>
      <descriptions :columns="descriptionsList.slice(-1)" :data-source="alarmDetails" :col-span="24" />
    </template>
  </div>
</template>

<script>
import InfoTitle from '@gis/lib/components/splitter/info-title.vue';
import { handleCommonRes } from '@gis/lib/utils/resolver.js';
import { allAlarmDetails } from '@gis/lib/api';
import { getEnumText } from '@gis/lib/enums/index.js';

export default {
  name: 'push-details',
  components: { InfoTitle },
  props: {
    details: { type: Object, default: () => {} },
  },
  data() {
    return {
      alarmDetails: {},
      descriptionsList: [
        { label: '小区名称', key: 'yard_name' },
        { label: '小区类型', key: 'yard_type' },
        { label: '登陆用户名', key: 'username' },
        { label: '小区编号', key: 'community' },
        { label: '待审核人数', key: 'user_count' },
        { label: '最后一次推送', key: 'newest_time' },

        { label: '预警时间', key: 'warn_time' },
        { label: '预警内容', key: 'warn_content' },
        { label: '处理状态', key: 'handle_status', format: (v) => getEnumText('alarmHandleStatus', v) },
        { label: '是否发送短信', key: 'send_sms_status', format: (v) => getEnumText('isPush', v) },
        { label: '处理人', key: 'handle_people_name' },
        { label: '处理时间', key: 'handle_time' },
        { label: '处理结果', key: 'handle_result' },
        { label: '短信接收人', key: 'send_sms_people' },
      ],
    };
  },
  created() {
    this.getAlarmDetails(); //预警详情
  },
  methods: {
    async getAlarmDetails() {
      const data = await handleCommonRes(allAlarmDetails, { id: this.details.id }, { defaultValue: {} });
      this.alarmDetails = Object.assign({}, this.details, data);
    },
  },
};
</script>

<style scoped lang="less">
.provincial-details {
  width: 100%;
  height: 100%;
  overflow: hidden;
  padding: 20px;
}
</style>
